<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1.0, user-scalable=no" />
		<title>情人节租赁服务</title>
		<script>
		var _hmt = _hmt || [];
		(function() {
		  var hm = document.createElement("script");
		  hm.src = "https://hm.baidu.com/hm.js?fa2b1f8a111a9aac1fe1b52a24543566";
		  var s = document.getElementsByTagName("script")[0]; 
		  s.parentNode.insertBefore(hm, s);
		})();
		</script>
		<link rel="stylesheet" href="<%=path %>/valsday/css/public.css" />
		<link rel="stylesheet" href="<%=path %>/valsday/css/animate.css" />
	</head>
	<body>
		<span id="musicControl">
		    <a id="mc_play" class="onx" onclick="play_music();">
		        <audio id="musicfx" loop="loop" autoplay="true" src="<%=path %>/valsday/song/song.mp3">
		        </audio>
		    </a>
		</span>	
		<div class="bd">
			<div class="dh-gou">
				<img src="<%=path %>/valsday/img/gt1.png" alt="" id="gou"/>
				<img src="<%=path %>/valsday/img/gou.png" alt="" id="gou1"/>
			</div>
			<div class="dh-wz" style="display: none;">
				<div class="long-wz">
					<img src="<%=path %>/valsday/img/wz1.png" alt="" class="wow flipInX animated"/>
					<img src="<%=path %>/valsday/img/wz2.png" alt="" class="wow flipInX animated"  data-wow-delay="1s"/>
				</div>
				<div class="short-wz">
					<img src="<%=path %>/valsday/img/wzx1.png" alt="" class="wow fadeIn animated" data-wow-delay="1.5s"/>
					<img src="<%=path %>/valsday/img/wzx2.png" alt="" class="wow fadeIn animated" data-wow-delay="2s"/>
					<img src="<%=path %>/valsday/img/wzx3.png" alt="" class="wow fadeIn animated" data-wow-delay="2.5s" />
					<img src="<%=path %>/valsday/img/wzx4.png" alt="" class="wow fadeIn animated" data-wow-delay="3s" />
				</div>
				<div class="dian">
					<img src="<%=path %>/valsday/img/wz3.png" alt=""  class="wow fadeIn animated" data-wow-delay="3.5s" />
				</div>	
			</div>
			<div class="dh-list" style="display: none;">
				<div class="dh-m">
					<span class="dh-list-bg wow bounceInLeft animated" data-wow-delay="0.5s"><img src="<%=path %>/valsday/img/m-bg.png" alt="" /></span>
					<span class="dh-m-gou wow bounceInLeft animated" data-wow-delay="0.5s"><img src="<%=path %>/valsday/img/m-gou1.png" alt="" /></span>
					<span class="dh-m-mmm wow bounceIn animated" data-wow-delay="1.5s"><img src="<%=path %>/valsday/img/mmm.png" alt="" /></span>
					<span class="zzc wow fadeIn animated" data-wow-delay="7s">
						<span class="zzc-bg"><img src="img/m-zz.png" alt="" /></span>
						<img src="img/m-wz.png" alt="" class="wow bounceInDown animated " data-wow-delay="7.5s"/>
					</span>
				</div>
				<div class="dh-t">
					<span class="dh-list-bg wow bounceInRight animated" data-wow-delay="2.5s"><img src="<%=path %>/valsday/img/t-bg.png" alt="" /></span>
					<span class="dh-t-gou wow bounceInRight animated" data-wow-delay="2.5s"><img src="<%=path %>/valsday/img/t-gou1.png" alt="" /></span>
					<span class="dh-t-ttt wow bounceIn animated" data-wow-delay="3.5s"><img src="<%=path %>/valsday/img/ttt.png" alt="" /></span>
					<span class="zzc wow fadeIn animated" data-wow-delay="9s">
						<span class="zzc-bg"><img src="img/t-zz.png" alt="" /></span>
						<img src="img/t-wz.png" alt=""  class="wow bounceInLeft animated " data-wow-delay="9.5s"/>
					</span>
				</div>
				<div class="dh-c">
					<span class="dh-list-bg wow bounceInLeft animated" data-wow-delay="4.5s"><img src="<%=path %>/valsday/img/c-bg.png" alt="" /></span>
					<span class="dh-c-gou wow bounceInLeft animated" data-wow-delay="4.5s"><img src="<%=path %>/valsday/img/c-gou1.png" alt="" /></span>
					<span class="dh-c-ccc wow bounceIn animated" data-wow-delay="5.5s"><img src="<%=path %>/valsday/img/ccc.png" alt="" /></span>
					<span class="zzc wow fadeIn animated" data-wow-delay="11s">
						<span class="zzc-bg"><img src="img/c-zz.png" alt="" /></span>
						<img src="img/c-wz.png"  class="wow bounceInUp animated " alt=""  data-wow-delay="11.5s"/>
					</span>
				</div>
			</div>
			<div class="de wow animated bounceInDown" style="display: none;">
				<div class="de-light">
					<img src="<%=path %>/valsday/img/de-g.png" alt="" class="light"/>
					<span>
						<img src="<%=path %>/valsday/img/de-gou1.png" alt="" />
					</span>					
				</div>
				<div class="de-word">
					<img src="<%=path %>/valsday/img/de-wz.png" alt="" />
				</div>
		    </div>
		    <div class="ls">
		    	<div class="ls-wz1 wow bounceIn animated" data-wow-delay="0.5s"><img src="<%=path %>/valsday/img/ls-wz1.png" alt="" /></div>
		    	<div class="ls-wz2 wow bounceIn animated" data-wow-delay="1.5s"><img src="<%=path %>/valsday/img/ls-wz2.png" alt="" /></div>
		    	<div class="ls-btn"><!-- <a href="192.168.1.3:8080/h5/valsday/play.html"> --><img id="play" src="<%=path %>/valsday/img/ls-btn.png" alt="" /><!-- </a> --></div>
		    	<%-- <a href="${baseUrl }/play.html">点这里</a> --%>
		    </div>
		</div>
				
		<script src="<%=path %>/valsday/js/jquery-2.2.3.min.js" type="text/javascript"></script>
		<script src="<%=path %>/valsday/js/wow.js" type="text/javascript"></script>
		<script src="<%=path %>/valsday/js/public.js" type="text/javascript"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>	
		<script>
		    new WOW().init();		              
            window.onload=function(){
            	var windowHeight1=$(window).height()/2.8;
            	var windowHeight2=$(window).height()/2.33333;
            	$('.dh-m .dh-list-bg img').height(windowHeight1);            	
            	$('.dh-m .zzc-bg img').height(windowHeight1);
            	$('.dh-t .zzc-bg img').height(windowHeight2);
            	$('.dh-c .zzc-bg img').height(windowHeight1);
            	$('.dh-t .dh-list-bg img').height(windowHeight2);
            	$('.dh-c .dh-list-bg img').height(windowHeight1);
           		var allHeight=$('#gou1').height()+$('#gou').height();
            	$('.dh-gou').height(allHeight)
            }
		
            $("#play").click(function(){
            	window.location.href="play.html";
            });
		</script>
		<script type="text/javascript">
		//微信jssdk config
		wx.config({
			debug : false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
			appId : '${signObj.appid}', // 必填，公众号的唯一标识
			timestamp : '${signObj.timestamp}', // 必填，生成签名的时间戳
			nonceStr : '${signObj.noncestr}', // 必填，生成签名的随机串
			signature : '${signObj.signature}',// 必填，签名，见附录1
			jsApiList : [ 'checkJsApi', //判断当前客户端版本是否支持指定JS接口
			'onMenuShareTimeline', //分享给好友
			'onMenuShareAppMessage', //分享到朋友圈
			'onMenuShareQZone', //分享到Q空间
			'onMenuShareWeibo',//分享到微博
			'onMenuShareQQ'//分享到qq
			]
		// 必填，需要使用的JS接口列表，所有JS接口列表见附录2
		});
		var title="“宣臻”邀你一起过个不虐狗的情人节！ 最后一页有惊喜";
		var description="情人节回馈  最后一页有惊喜";
		var imgUrl="${basePath}/<%=path %>/valsday/img/share.jpg";
		var shareBaseUrl='${baseUrl}';
		wx.ready(function() { //ready函数用于调用API，如果你的网页在加载后就需要自定义分享和回调功能，需要在此调用分享函数。//如果是微信游戏结束后，需要点击按钮触发得到分值后分享，这里就不需要调用API了，可以在按钮上绑定事件直接调用。因此，微信游戏由于大多需要用户先触发获取分值，此处请不要填写如下所示的分享API
			wx.onMenuShareTimeline({ //分享到朋友圈的API  
						title : title, // 分享标题
						link : shareBaseUrl+'/auth2.html', // 分享链接
						imgUrl : imgUrl, // 分享图标
						success : function() {
							// 用户确认分享后执行的回调函数
						},
						cancel : function() {
							// 用户取消分享后执行的回调函数
						}
					});
			wx.onMenuShareAppMessage({//分享到朋友 
						title : title, // 分享标题
						desc : description, // 分享描述
						link : shareBaseUrl+'/auth2.html', // 分享链接
						imgUrl : imgUrl, // 分享图标
						type : 'link', // 分享类型,music、video或link，不填默认为link
						dataUrl : '', // 如果type是music或video，则要提供数据链接，默认为空
						success : function(){
							alert("成功执行")
							// 用户确认分享后执行的回调函数
						},
						cancel : function() {
							// 用户取消分享后执行的回调函数
						}
					});
			wx.onMenuShareQZone({//分享到qq空间
			    title: title, // 分享标题
			    desc: description, // 分享描述
			    link: shareBaseUrl+'//auth2.html', // 分享链接
			    imgUrl: imgUrl, // 分享图标
			    success: function () { 
			       // 用户确认分享后执行的回调函数
			    	
			    },
			    cancel: function () { 
			        // 用户取消分享后执行的回调函数
			    }
			});
			wx.onMenuShareWeibo({
			    title: title, // 分享标题
			    desc: description, // 分享描述
			    link: shareBaseUrl+'/auth2.html', // 分享链接
			    imgUrl: imgUrl, // 分享图标
			    success: function () { 
			       // 用户确认分享后执行的回调函数
			    	
			    },
			    cancel: function () { 
			        // 用户取消分享后执行的回调函数
			    }
			});
			wx.onMenuShareQQ({//分享到qq
			    title: title, // 分享标题
			    desc: description, // 分享描述
			    link: shareBaseUrl+'/auth2.html', // 分享链接
			    imgUrl: imgUrl, // 分享图标
			    success: function () { 
			       // 用户确认分享后执行的回调函数
			    	
			    },
			    cancel: function () { 
			       // 用户取消分享后执行的回调函数
			    }
			});
		});
	</script>
	</body>
</html>

